{extend name="public/base" /}

{block name="main"}

<el-row :gutter="20">
    <el-col :span="12" :offset="6">
    <el-form ref="form" :model="formd" label-width="120px" size="small">
        <el-form-item label="KEY">
            <el-input :disabled="true" v-model="formd.key"></el-input>
        </el-form-item>
        <el-form-item label="值类型">
            <el-select v-model="formd.value_type" placeholder="请选择值类型">
                {foreach $vts as $key=>$vo }
                <el-option label="{$vo}" value="{$key}"></el-option>
                {/foreach}

            </el-select>

        </el-form-item>
        <el-form-item label="VALUE ">
            <el-input type="textarea" rows="10" v-model="formd.value" maxlength="5000"    show-word-limit></el-input>

        </el-form-item>

        {foreach $dimensionList as $item }
        <el-form-item label="{$item['title']}">
            <el-input :disabled="true"  v-model="formd.{$item['key']}"></el-input>
        </el-form-item>
        {/foreach}



        <el-form-item label="备注">
            <el-input type="textarea" v-model="formd.rem"></el-input>
        </el-form-item>
        <el-form-item label="禁用">
            <el-checkbox v-model="status_b">禁用</el-checkbox>
        </el-form-item>

        <el-form-item label="创建时间 ">
            {{formd.createtime}}
        </el-form-item>
        <el-form-item label="最后修改时间 ">
            {{formd.updatetime}}
        </el-form-item>
        <el-form-item label="最后访问时间 ">
            {{formd.looktime}}
        </el-form-item>
        <el-form-item label="今日访问次数 ">
            {{formd.lookcount}}
        </el-form-item>

        <el-form-item>
            <el-link  v-bind:href="valuetesturl" type="primary">取值测试</el-link >

        </el-form-item>
        <el-form-item>
            <el-button type="primary" @click="onSubmit">修改并删除缓存</el-button>

        </el-form-item>

        <el-form-item>
            <el-button type="primary" @click="onDel">删除本行配置</el-button>

        </el-form-item>
    </el-form>

    </el-col>
</el-row>
{include file="public/config_rem"  /}
{/block}

{block name="js"}

<script>
    var keys= {:json_encode($keys)};
    var config={:json_encode($config)};


</script>
<script>
    new Vue({
        el: '#app',
        data: {
            formd: config
        },

        methods: {
            onSubmit() {

                console.log(this.formd);
                var vm = this;
                if(!vm.formd.key){
                    alert("key is not null!");
                    return ;
                }
                if(!vm.formd.value_type){
                    alert("值类型不能为空!");
                    return ;
                }
                if(!confirm("确定修改？")){
                    return ;
                }
                axios
                    .post('/index/api/updateconfig',vm.formd )
                    .then(function (response) {
                        if(confirm("修改成功！测试一下？")){
                            window.location= vm.valuetesturl ;
                        }
                        else{
                            location.reload();
                        }

                    });
            },
            onDel() {
                if(!confirm("危险操作，确定删除？")){
                    return ;
                }
                console.log(this.formd);
                var vm = this;

                axios
                    .post('/index/api/delConfig',vm.formd )
                    .then(function (response) {
                        alert("删除成功，关闭本页！");
                        window.opener=null;
                        window.close();
                    });
            },
        },
        computed: {
            status_b: {
                // getter
                get: function () {
                    return this.formd.status ==1 ;
                },
                // setter
                set: function (newValue) {
                    this.formd.status = newValue?1:0;
                }
            },
            valuetesturl:{
                get: function () {
                    return "/valuetest?"+ getSelectString(this.formd,keys)
                },
            }
        }
    })
</script>

{/block}